<div class="logo">
  <img src="../../assets/img/logo.png">
</div>
<h3>让您种地更简单 高产更放心</h3>

<form #userForm="ngForm" (ngSubmit)="logForm(user)"  novalidate>
  <md-input-container class="example-full-width ">
    <!--在使用  (input)="telGet()"  (keyup)="keyupHandler1($event)"
    <md-hint align="end">{{name.value.length}}/11</md-hint>
    <md-hint align="end">{{code.value.length}}/6</md-hint>
  -->
      <input mdInput  type="tel" name="mobile" #name="ngModel"  placeholder="请输入手机号" [(ngModel)]="user.mobile" required minlength="11" maxlength="11" pattern="^1(3|4|5|7|8)\d{9}$" value="mobile" >
        <span *ngIf="name.valid" class="label label-success">有效</span>
        <div class="alert">
            <p *ngIf="name.errors?.minlength">请输入11位有效手机号，格式不对</p>
            <p *ngIf="name.errors?.required">必须输入手机号</p>
            <p *ngIf="name.errors?.pattern">请输入11位有效手机号，格式不对</p>
        </div>
  </md-input-container>
  <div class="tip" *ngIf="this.blUser">{{tip}}</div>
  <div class="tip" *ngIf="this.blmessage">{{tipMessage}}</div>
  <div class="tiploading">
    <!--
    *ngIf="this.tipLoadingMobile0"
    *ngIf="this.tipLoadingMobile1"
    *ngIf="this.tipLoadingMobile2"
  -->
      <p>{{this.tipLoadingMobile0}}</p>
      <p>{{this.tipLoadingMobile1}}</p>
      <p>{{this.tipLoadingMobile2}}</p>
  </div>

  <a class="example-button-row"  md-button class="positionrem" (click)="getCaptcha()">{{timeText}}{{now}}</a>

  <md-input-container class="example-full-width" >
      <input mdInput type="tel" name="code" #code="ngModel"  placeholder="请输入验证码" value="code" required [(ngModel)]="user.code"  minlength="6" maxlength="6"  (keyup)="keyupHandler1($event)" >
      <span *ngIf="code.valid" class="label label-success">有效</span>
      <div class="alert alert-danger">
          <p *ngIf="code.errors?.minlength">验证码必须为6位数</p>
          <p *ngIf="code.errors?.required">只允许输入数字</p>
      </div>

  </md-input-container>
  <div class="button-row">
      <button md-raised-button type="button"  [disabled]="!userForm.valid" [disabled]="userForm.valid==0"  (click) ="submitCode()"  >立即绑定</button>
  </div>
</form>
<div *ngIf="loading" class="loading">
  <div class="spinner">
    <div class="spinner-container container1">
      <div class="circle1"></div>
      <div class="circle2"></div>
      <div class="circle3"></div>
      <div class="circle4"></div>
    </div>
    <div class="spinner-container container2">
      <div class="circle1"></div>
      <div class="circle2"></div>
      <div class="circle3"></div>
      <div class="circle4"></div>
    </div>
    <div class="spinner-container container3">
      <div class="circle1"></div>
      <div class="circle2"></div>
      <div class="circle3"></div>
      <div class="circle4"></div>
    </div>
  </div>
</div>
<footer>
  <div>
    若未收到验证码或无法绑定 请拨打 <em>400-816-9956</em>
  </div>
</footer>
<!--(input) ="telCheck(tel.value)"-->
<!--
[routerLink]="['/suc']"
<div>
  <span>user: </span> {{user | json}}
</div>
<div>
  <span>表单：</span> {{userForm.value | json}}
</div>
  <div class="picture">
    <div><img/>这里是验证码图片</div>

   <input type="text" class="form-control" placeholder="">
   <input type="text" class="form-control" placeholder="">
   <input type="text" class="form-control" placeholder="">
   <input type="text" class="form-control" placeholder="">
  </div>
-->
